<template>
  <div>
    <h2>数据推动视图</h2>
    <p>{{str}}</p>
    <button @click="aa">翻转世界</button>
  </div>
</template>

<script>
export default {
  data () {
    return {
      str:'你好世界'
    }
  },
  methods:{
    aa () {
      // this.str = 'hello'
      this.str = this.str.split('').reverse().join('')
      console.log(this.str);
    }
  }
}
</script>

<style>
  div {
    width: 300px;
    height: 300px;
    background-color: pink;
  }
</style>